<!DOCTYPE html>
<html class="loading" lang="en" data-textdirection="ltr">

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
  <meta name="author" content="PIXINVENT">
  <title>加班费用管理后台</title>
  <link rel="stylesheet" type="text/css" href="app-assets/css/vendors.css">
  <link rel="stylesheet" type="text/css" href="app-assets/css/vertical-menu.css">
  <link rel="stylesheet" type="text/css" href="app-assets/css/bootstrap-extended.css">
</head>

<body>
  <div class="content-wrapper">
    <div class="content-header ">
      <div class="content-header-left mb-2 clearfix">
        <h3 class="content-header-title mb-0">加班费用</h3>
      </div>
    </div>
    <div class="card">
      <div class="card-content">
        <div class="card-body">
          <div class="searchbox">
            <form class="form-inline">
              <div class="form-group">
                <input type="text" class="form-control" placeholder="请填写姓名">
              </div>
              <div class="form-group">
                <input type="text" class="form-control" placeholder="请填写编号">
              </div>
              <div class="form-group">
                <button type="submit" class="btn btn-primary">查询</button>
              </div>

            </form>
          </div>


          <div class="tablebox1">
            <table class="table">
              <thead>
                <tr>
                  <th>序号</th>
                  <th>姓名</th>
                  <th>职工号</th>
                  <th>加班时长</th>
                  <th>加班费</th>
                  <th>加班日期</th>
                  <th>操作</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                  <td>001</td>
                  <td>小六</td>
                  <td>2101</td>
                  <td>1h</td>
                  <td>¥80.00</td>
                  <td>2021-09-10</td>
                  <td>
                    <a class="btn btn-info btn-td" href="#" data-toggle="modal" data-target="#myModal">修改</a>
                  </td>
                </tr>
                <tr>
                  <td>002</td>
                  <td>老吴</td>
                  <td>4526</td>
                  <td>2h</td>
                  <td>¥160.00</td>
                  <td>2021-09-13</td>
                  <td>
                    <a class="btn btn-info btn-td" href="#" data-toggle="modal" data-target="#myModal">修改</a>
                  </td>
                </tr>
                <tr>
                  <td>003</td>
                  <td>王霸</td>
                  <td>1014</td>
                  <td>1h</td>
                  <td>¥80.00</td>
                  <td>2021-09-20</td>
                  <td>
                    <a class="btn btn-info btn-td" href="#" data-toggle="modal" data-target="#myModal">修改</a>
                  </td>
                </tr>
              </tbody>
            </table>

            <div class="page clearfix">
              <div class="pull-left">共 100 条记录 第 1 / 20 页</div>
              <div class="pull-right">
                <nav aria-label="..." class="pull-left">
                  <ul class="pagination">
                    <li class="disabled"><a href="#" aria-label="Previous"><span aria-hidden="true">«</span></a></li>
                    <li class="active"><a href="#">1 <span class="sr-only">(current)</span></a></li>
                    <li><a href="#">2</a></li>
                    <li><a href="#">3</a></li>
                    <li><a href="#">4</a></li>
                    <li><a href="#">5</a></li>
                    <li><a href="#" aria-label="Next"><span aria-hidden="true">»</span></a></li>
                  </ul>
                </nav>
                <div class="pull-left p-r-20  p-l-20">
                  <select class="form-control">
                    <option>10条每页</option>
                  </select>
                </div>
                <div class="pull-left">跳至
                  <input type="text" value="" class="form-control">
                  页</div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
              aria-hidden="true">&times;</span></button>
          <h4 class="modal-title">编辑加班费用</h4>
        </div>
        <div class="modal-body">
          <div class="form1 form2">
            <ul class="row">
              <li class="col-xs-10"><span>姓名：</span><input type="text" class="form-control"></li>
              <li class="col-xs-10"><span>职工号：</span><input type="text" class="form-control"></li>
              <li class="col-xs-10"><span>加班时长：</span><input type="text" class="form-control"></li>
              <li class="col-xs-10"><span>加班费：</span><input type="text" class="form-control"></li>
              <li class="col-xs-10"><span>加班日期：</span><input type="text" class="form-control"></li>
            </ul>
          </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
          <button type="button" class="btn btn-primary">保存</button>
        </div>
      </div>
    </div>
  </div>

  <script src="app-assets/js/vendors.min.js" type="text/javascript"></script>
  <script src="app-assets/js/app-menu.js" type="text/javascript"></script>
  <script src="app-assets/js/app.js" type="text/javascript"></script>
  <script src="app-assets/js/echarts.min.js" type="text/javascript"></script>
  <script src="app-assets/js/sweetalert2.js" type="text/javascript"></script>
  <script src="app-assets/laydate/laydate.js" type="text/javascript"></script>
  <script>
    lay('#version').html('-v' + laydate.v);
    laydate.render({
      elem: '#test1'
      , range: true
      , theme: '#00B5B8'
    });
  </script>

</body>

</html>